<template>
  <div class="box">
    <van-notice-bar
      left-icon="volume-o"
      text="根据疫情防控要求，即日起，来院就诊患者及陪护须在健康码 “临时弹窗” 人员在哈哈哈人民医院了解就诊流程"
    />
    <van-button icon="plus" type="primary" class="plus_btn" @click="toUser"
      >初次使用，请绑定就诊人</van-button
    >
    <div class="doorService">
      <van-grid>
        <van-grid-item icon="setting" text="自助开单" iconColor="#4c93fd" />
        <van-grid-item icon="coupon" text="检查预约" iconColor="#21c6c8" />
        <van-grid-item icon="play-circle" text="智能导诊" iconColor="#4d94fe" />
        <van-grid-item icon="card" text="在线建卡" iconColor="#21c6c8" />
      </van-grid>
      <van-grid>
        <van-grid-item
          icon="add-square
"
          text="自助取号"
          iconColor="#fdbb0d"
        />
        <van-grid-item icon="manager" text="候诊查询" iconColor="#4c93fd" />
        <van-grid-item icon="map-marked" text="院内导航" iconColor="#fdae0b" />
        <van-grid-item icon="cluster" text="流行病调查" iconColor="#29d3d2" />
      </van-grid>
      <van-grid>
        <van-grid-item
          icon="youzan-shield"
          text="满意度调查"
          iconColor="#fdbb0d"
        />
        <van-grid-item icon="sort" text="老年版" iconColor="#fc5d1b" />
        <van-grid-item
          icon="wechat-moments"
          text="超声报告"
          iconColor="#4c93fd"
        />
        <van-grid-item icon="printer" text="电子处方" iconColor="#fc5d1b" />
      </van-grid>
      <!-- <van-grid>
        <van-grid-item icon="photo-o" text="文字" />
        <van-grid-item icon="photo-o" text="文字" />
        <van-grid-item icon="photo-o" text="文字" />
        <van-grid-item icon="photo-o" text="文字" />
      </van-grid> -->
    </div>
  </div>
</template>

<script lang="ts" setup>

import router from "../router/index";
const toUser = () => {
  router.push({ path: "/user" });
};

</script>

<style lang="less" scoped>
.box {
  width: 100%;
  height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  background: url(../../public/images/login.png) no-repeat;
  background-size: cover;
  .van-notice-bar {
    width: 70%;
    height: 30px;
    margin-top: 175px;
  }
  .plus_btn {
    width: 90%;
    border-radius: 6px;
    margin-top: 16px;
    background-color: #3cd8cd;
    font-family: "FZShuTi";
    font-size: 16px;
    border: none;
  }
  .doorService {
    width: 92%;
    height: 325px;
    // background-color: skyblue;
    margin-top: 20px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    font-family: "华文行楷";
    .van-grid {
      display: flex;
      justify-content: center;
      align-items: center;
      width: 100%;
      //   height: 50px;
    }
    // .service_icon {
    //   width: 30px;
    //   height: 30px;
    //   font-size: 15px;
    //   color: white;
    // }
  }
}
</style>